<template>
<div>
{{id}}
<el-row>
	<el-form :inline="true" :model="form" size="small">

    <el-form-item v-if="gridid == ''">
	    <el-cascader 
			style="width:350px;"
			filterable
			:options="treedata"
			:props="props1"
			filterable
			change-on-select
			v-model="selectedOptions">
		</el-cascader>
	</el-form-item>

	<el-form-item >
	    <el-input v-model="form.name" placeholder="企业名称"></el-input>
	</el-form-item>

	<el-form-item >
	    <el-select v-model="form.company_type"  placeholder="企业类型" style="width:100px;">
	      <el-option 
	      v-for="item in company_type"
	      :label="item.label" :value="item.value"></el-option>
	    </el-select>
	</el-form-item>

	<el-form-item>
	    <el-button type="primary" @click="init">查询</el-button>
	</el-form-item>
</el-form>
</el-row>


<el-row>
<el-table
    :data="list.results"
    border
    style="width: 100%">
    <el-table-column
      prop="name"
      label="名称"
      width="250">
    </el-table-column>
    <el-table-column
      prop="company_type_name"
      label="类型"
      >
    </el-table-column>
  </el-table>
</el-row>

<el-row class="text-right mt20 mb20">
<el-pagination
  @size-change="handleSizeChange"
  @current-change="handleCurrentChange"
  :current-page="pageNo"
  :page-size="pageSize"
  layout="total, prev, pager, next"
  :total="list.totalRecord">
</el-pagination>
</el-row>

</div>
</template>

<script>


export default {
	
	name : 'company',
	
	data () {
		return {

		  	form : {},

		  	props1 : {
				value : 'id',
				label : 'name',
			},

			selectedOptions : ['1'],

			list : {},

			pageNo : 1,
		  	pageSize : 5,

		  	status_label : ['', '处理中', '已完成'],

		  	status_select_label : [
				{label : '全部', value : undefined},
				{label : '处理中', value : '1'},
				{label : '已完成', value : '2'},
			],

			company_type : [],
		}
	},

	props : {
		treedata: {
			type: Array,
			default () {
				return []
			},
		},

		gridid : {
			type : String,
			default : '',
		}
	},

	components : {
	},

	computed : {
		id () {
			this.init();
			return "";
		}
	},

	methods : {
		init () {
			let para = {
				fun : 'subUnloadingList',
				//grid_id : this.selectedOptions[this.selectedOptions.length - 1],
				...this.form,
				pageNo : this.pageNo,
				pageSize : this.pageSize,
				cb : res => {
					console.log('subUnloadingList');
					console.log(res);
					this.list = res;
				}
			};

			if(this.gridid == ''){
				para['grid_id'] = this.selectedOptions[this.selectedOptions.length - 1];
			}else{
				para['grid_id'] = this.gridid;
			}

			this.$http(para);
		},

		handleSizeChange (val) {
			this.pageSize = val;
			this.init();
		},

		handleCurrentChange (val) {
			this.pageNo = val;
			this.init();
		},

		playback (item) {
			this.$emit('getpoint', {
				...item,
				what : 'company',
				lon : item.longitude, 
				lat : item.latitude,
			});
		},

		info () {

		},
	},

	watch : {
	    
	},

	mounted () {
		this.init();

		this.$http({
			fun : 'getListByType',
			type : 'company_type',
			cb : res => {
				console.log(res);
				this.company_type = res;
			}
		});
	},

}
</script>

<style scoped>

</style>
